<template>
  <div class="container my-main">
    <el-row>
      <left-side :menuList="menuList"></left-side>
      <div class="main-right">
        <transition name="fade-transform" mode="out-in">
          <router-view />
        </transition>
      </div>
    </el-row>
  </div>
</template>

<script>
import LeftSide from './components/myLeft'
export default {
  components: {
    LeftSide
  },
  data() {
    return {
      menuList: []
    }
  },
  created() {
    this.getUserProfileInfo()
  },
  methods: {
    // 获取个人中心
    getUserProfileInfo() {
      this.$api.getProfile(res => {
        const { data } = res
        this.menuList = data.list
        this.$store.dispatch('my/SET_ACCOUNT_INFO', data.user)
        this.$store.dispatch('my_integral/SET_INTEGRAL_INIT', {
          count: data.user.credit || 0,
          state: data.user.punch_in
        })
        this.$store.dispatch('my_integral/SET_INTEGRAL_INIT', {
          count: data.user.credit || 0,
          state: data.user.punch_in
        })
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.my-main {
  margin-top: 10px;
  margin-bottom: 60px;
  .main-right {
    width: 870px;
    margin-left: 20px;
    float: left;
    padding: 15px 20px;
    background-color: #ffffff;
    min-height: calc(100vh - 193px);
  }
}
</style>
